<script setup lang="ts">
import { ref } from 'vue';

const visiable = ref(false);
function toggleModal() {
    visiable.value = !visiable.value;
}
</script>
<template>
    <f-modal v-model="visiable" title="This is the modal dialog title">
        <div style="padding: 0 20px">This is modal content.</div>
    </f-modal>
    <f-button @click="toggleModal">click to popup modal dialog {{ visiable }}</f-button>
</template>
